body {
  background: $primary-background;
}
.modal-content {
  background: $primary-background;
}
.overlay {
  position: fixed;
  visibility: hidden;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: theme-color("overlay");
  opacity: 0;
  z-index: 5;
  cursor: pointer;
  transition: opacity 0.5s, visibility 0s 0.5s;
  &.shown {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.5s;
  }
}

.dropdown-menu {
  background: $primary-background;
  border-color: $global-border-style;
  .dropdown-item {
    &:hover,
    &:focus {
      background: $secondary-background;
      color: $secondary-font-color;
    }
  }
}

.form-control,
.form-control:focus,
.spree-flat-input {
  background: $input-background;
  color: color-yiq($input-background);
}

@include media-breakpoint-down(md) {
  input[type="email"],
  input[type="number"],
  input[type="password"],
  input[type="search"],
  input[type="tel"],
  input[type="text"],
  input[type="url"],
  select,
  select:focus,
  textarea {
    font-size: 16px !important;
  }
}
